<script setup lang='ts'>
import { ref, watch } from 'vue';
import { upTitle } from "../../../../api/titleApi";
import { upDataMaterial } from "../../../../api/Material";
const { upTitleDialogVisible,
    title, myupData, page, _id, oldName, types
} = defineProps<{
    upTitleDialogVisible: boolean
    title: string
    myupData?: any
    page: number
    _id: string
    oldName?: any
    types?: any
}>()
const inFo = ref(upTitleDialogVisible)
//监视数据
watch(() => upTitleDialogVisible, (newVal) => {
    inFo.value = newVal
})
// 定义 emit 函数
const emit = defineEmits(['update:upTitleDialogVisible', 'update:newtitleData']);

// 定义一个方法来改变 centerDialogVisible 并发出事件
const toggleDialog = () => {
    emit('update:upTitleDialogVisible', !upTitleDialogVisible);
};

//发送数据
const sendData = async () => {
    switch (title) {
        case '修改标题':
            emit('update:upTitleDialogVisible', !upTitleDialogVisible);
            const res = await upTitle({ name: myupData, page, _id, oldName })
            emit('update:newtitleData', res.data.data);
            break;
        case '修改类型':
            emit('update:upTitleDialogVisible', !upTitleDialogVisible);
            const upres = await upDataMaterial({ upData: types, page, _id})
            emit('update:newtitleData', upres.data.data);
            break;
    }

}
</script>

<template>
    <el-dialog v-model="inFo" :title :show-close="false" width="500" draggable align-center>
        <slot>1</slot>
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="toggleDialog">取消</el-button>
                <el-button type="primary" @click="sendData">
                    确定
                </el-button>
            </div>
        </template>
    </el-dialog>
</template>

<style scoped></style>